<template>
  <div>
    <div class="list" v-for="(item, index) in filterList()" :key="index">
      <p class="shanchu" v-if="template.type === 'LIST' && (!template.required || (template.required && filterList().length > 1))">
        <span @click="deleteList(template, index)"><i class="iconfont icon-shanchu"></i>{{$t('common.delete')}}</span>
      </p>
      <slot name="editContent" :fields="template.fields" :index="index"></slot>
    </div>
  </div>
</template>
<script>
export default {
  name: 'ResumeUpdateDiv',
  props: [ 'template', 'group' ],
  data () {
    return {
    }
  },
  created () {
  },
  methods: {
    deleteList (template, index) {
      this.$emit('del', { template, index })
    },
    filterList () {
      // 类型LIST 根据数据渲染行数 没有数据如果required为true则渲染为一行，为false渲染为[]
      // 类型不为 LIST 直接渲染为[0]
      if (this.template.type === 'LIST' && this.group && this.group.length !== 0) {
        return this.group
      } else if (this.template.type === 'LIST' && (!this.group || this.group.length === 0) && !this.template.required) {
        return []
      // } else if (this.template.type === 'LIST' && (!this.group && this.group.length === 0) && this.template.required) {
      //   return [0]
      } else {
        return [0]
      }
      // return this.template.type === 'LIST' && this.group && this.group.length !== 0 ? this.group : [0] // 需要根据当前类型处理是否给默认一行 // 还需要根据当前值处理删除按钮的展示
    }
  }
}
</script>
<style lang="stylus" scoped>
@import '../../styles/var.styl'
.list
  padding 6px 15px
  .shanchu
    text-align right
    color errorColor
    cursor pointer
    span
      display inline-block
  &:hover
    background var(--light-grey)
    padding 5px 9px
    border 1px solid borderColor
</style>
